<template>
  <div class="dashboard">
    <a-layout>
      <a-layout-sider width="200px">
        <a-menu
          mode="inline"
          :selected-keys="[$route.path]"
          class="menu-vertical"
        >
          <a-menu-item key="/dashboard" @click="$router.push('/dashboard')">
            <LineChartOutlined />
            <span>控制台</span>
          </a-menu-item>
          <a-menu-item key="/app-manage" @click="$router.push('/app-manage')">
            <FileOutlined />
            <span>APK管理</span>
          </a-menu-item>
        </a-menu>
      </a-layout-sider>
      
      <a-layout-content>
        <h2>管理控制台</h2>
        <a-row :gutter="20">
          <a-col :span="8">
            <a-card class="stat-card">
              <template #title>
                <div class="card-header">
                  <span>用户统计</span>
                  <a-button type="text" @click="fetchStats">刷新</a-button>
                </div>
              </template>
              <div class="stat-content">
                <a-statistic title="用户总数" :value="stats.userCount">
                  <template #prefix>
                    <UserOutlined />
                  </template>
                </a-statistic>
              </div>
            </a-card>
          </a-col>
        </a-row>
      </a-layout-content>
    </a-layout>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { LineChartOutlined, FileOutlined, UserOutlined } from '@ant-design/icons-vue'
import axios from 'axios'
import { message } from 'ant-design-vue'

const stats = ref({
  userCount: 0
})


</script>